/*****
thiz.config = $.extend({
	container: {},    //调用插件的容器（jquery对象）需要有宽高 包含左右盒子的直接父盒子
	leftMenuWidth:90, //左边Menu的width
	rightMenuWidth:200,
	speed:0.5,       //动画完成时间 单位s
	dragBarWidth:1,  //拖拽盒子的width
	dragEnable:true //左侧Menu是否可以拖动 默认可以
	minWidth:400 //左邊不能拖动的最小距离
}, config);
*****/
;(function($) {
	var layout = {
			leftIndex : 0, //判断点击sideBars
			rightIndex : 1, 
			init: function(config) {
				var thiz = this;
				thiz.config = $.extend({
					container: {}, 
					leftMenuWidth:90,
					rightMenuWidth:200,
					speed:0.5,
					dragBarWidth:2,
					dragEnable:true,
					minWidth:400
				}, config);
				
				thiz.initDom();    //初始化创建外层包含盒子
				thiz.config.container.resize(function(){
					thiz.resize();
				});
				return thiz;
			},
			initDom:function(){
				var thiz = this;
				var divArr = thiz.config.container.find(" > div"),
					cloneLeftCont = divArr.eq(0).remove(),
					cloneCenterCont = divArr.eq(1).remove(),
					cloneRightCont = divArr.eq(2).remove();
				//包裹盒子
				var outerContainer = $('<div class="outerContainer">\
											<div class="outerLeft clearfix"></div>\
											<div class="outerCenter"></div>\
											<div class="outerRight"></div>\
										</div>');
				thiz.config.container.append(outerContainer);
				thiz.config.outerLeft = outerContainer.find(".outerLeft");  //外层包裹盒子
				thiz.config.outerCenter = outerContainer.find(".outerCenter");
				thiz.config.outerRight = outerContainer.find(".outerRight");
				thiz.config.outerLeft.html(cloneLeftCont).append('<div class="outerLeftDrag"></div>');
				thiz.config.outerCenter.html(cloneCenterCont);
				thiz.config.outerRight.html(cloneRightCont).append('<div class="outerRightDrag"></div>');
				thiz.config.outerLeftDrag = thiz.config.outerLeft.find(".outerLeftDrag");
				thiz.config.outerRightDrag = thiz.config.outerRight.find(".outerRightDrag");
				thiz.config.outerLeft.css({
					"width":thiz.config.leftMenuWidth + "px",
					"borderRight": thiz.config.dragBarWidth +"px solid #d8e5f1"
				});
				thiz.config.outerLeftDrag.css({
					width: thiz.config.dragBarWidth + "px",
					height:100+"%",
					left:thiz.config.outerLeft.width()+"px",
					
				});
				thiz.config.outerRight.css({
					"width":thiz.config.rightMenuWidth + "px",
					"borderLeft": thiz.config.dragBarWidth +"px solid #d8e5f1",
					"right":-thiz.config.rightMenuWidth + "px"
				});
				thiz.config.outerRightDrag.css({
					width: thiz.config.dragBarWidth + "px",
					height:100+"%",
					right:thiz.config.outerRight.width()+"px",
					
				});
				thiz.config.outerCenter.css({
					"width":thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true) + "px",
					"position":"absolute",
					"left":thiz.config.outerLeft.outerWidth(true) + "px"
				});
				thiz.config.outerCenter.find(" > div").css({width:100 + "%"});
				thiz.config.outerLeft.append("<div class='sideBars'><em></em></div>");
				//点击按钮左侧
					thiz.config.sideBarsW = 15,
					thiz.config.sideHeight = 50;
				thiz.config.outerLeft.find(".sideBars").css({
					width: thiz.config.sideBarsW+"px",
					height:thiz.config.sideHeight+"px",
					right:0,
					top:50+"%",
					marginTop:-(thiz.config.sideHeight/2)+"px"
				});
				thiz.config.outerRight.append("<div class='sideBars'><em></em></div>");
				thiz.config.outerRight.find(".sideBars").addClass("back").css({
					width: thiz.config.sideBarsW+"px",
					height:thiz.config.sideHeight+"px",
					left:-(thiz.config.sideBarsW+ thiz.config.dragBarWidth) + "px",
					top:50+"%",
					marginTop:-(thiz.config.sideHeight/2)+"px"
				});
				$(document).on("click", ".sideBars", function(){
					if($(this).parent().attr("class") == "outerRight"){
						thiz.zoom($(this),"right"); //点击sideBars 重新布局
					}else{
						thiz.zoom($(this),"left");
					}
					
				});
				$(document).on("mousedown", ".outerLeftDrag,.outerRightDrag", function(ev){
					if(thiz.config.dragEnable){
						if($(this).attr("class") == "outerLeftDrag"){
							thiz.dragMove($(this), "left");
						}else{
							thiz.dragMove($(this), "right");
						}	
					}else{
						return;
					}
				});
				
			},
			zoom:function(_this, direction){
				var thiz = this;
				if(direction == "left"){
					if(thiz.leftIndex == 0){
						thiz.config.outerLeft.animate({"left":-thiz.config.outerLeft.outerWidth(true)+"px"}, thiz.speed, function(){});
						if(thiz.rightIndex == 0){
							thiz.config.outerCenter.animate({
								"width":(thiz.config.container.width() - thiz.config.outerRight.outerWidth(true))+"px",
								"left":0
							}, thiz.speed, function(){});
						}else{
							thiz.config.outerCenter.animate({
								"width":thiz.config.container.width()+"px",
								"left":0
							}, thiz.speed, function(){});
						}
						
						thiz.config.outerLeftDrag.css({
							"left":-(thiz.config.outerLeft.width()) + "px"
						});
						_this.addClass("back").css({
							right:-(thiz.config.sideBarsW + thiz.config.dragBarWidth) + "px",
						});
						thiz.leftIndex++;
					}else{
						thiz.config.outerLeft.animate({"left":0}, thiz.speed, function(){});
						if(thiz.rightIndex == 0){
							thiz.config.outerCenter.animate({
								"width":(thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true) - thiz.config.outerRight.width() - thiz.config.dragBarWidth)+"px",
								"left":thiz.config.outerLeft.outerWidth(true) + "px"
							}, thiz.speed, function(){});
						}else{
							thiz.config.outerCenter.animate({
								"width":thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true)+"px",
								"left":thiz.config.outerLeft.outerWidth(true) + "px"
							}, thiz.speed, function(){});
						}
						
						thiz.config.outerLeftDrag.css({
							"left":thiz.config.outerLeft.width()+"px"
						});
						_this.removeClass("back").css({
							right:0,
						});
						thiz.leftIndex--;
					}
				}else{
					if(thiz.rightIndex == 0){
						thiz.config.outerRight.animate({"right":-(thiz.config.outerRight.outerWidth(true))+"px"}, thiz.speed, function(){});
						if(thiz.leftIndex == 0){
							thiz.config.outerCenter.animate({
								"width":(thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true))+"px",
								"left":thiz.config.outerLeft.outerWidth(true) + "px"
							}, thiz.speed, function(){});
						}else{
							thiz.config.outerCenter.animate({
								"width":thiz.config.container.width()+"px",
								"left":0
							}, thiz.speed, function(){});
						}
						
						thiz.config.outerRightDrag.css({
							"right":-(thiz.config.outerRight.width()) + "px"
						});
						_this.addClass("back").css({
							left:-(thiz.config.sideBarsW + thiz.config.dragBarWidth) + "px",
						});
						thiz.rightIndex++;
					}else{
						thiz.config.outerRight.animate({"right":0}, thiz.speed, function(){});
						if(thiz.leftIndex == 0){
							thiz.config.outerCenter.animate({
								"width":(thiz.config.container.width() - thiz.config.outerRight.outerWidth(true) - thiz.config.outerLeft.width() - thiz.config.dragBarWidth)+"px"
							}, thiz.speed, function(){});
						}else{
							thiz.config.outerCenter.animate({
								"width":thiz.config.container.width() - thiz.config.outerRight.outerWidth(true)+"px",
							}, thiz.speed, function(){});
						}
						
						thiz.config.outerRightDrag.css({
							"right":thiz.config.outerRight.width()+"px"
						});
						_this.removeClass("back").css({
							left:0,
						});
						thiz.rightIndex--;
					}
				}
			},
			dragMove:function( _this, direction){
				var thiz = this,
					move = true,
					oEvent,dragLeft;
				$(document).on("mousemove",function(ev){
					oEvent = ev || window.event;
					var outerContainerPosition = thiz.getObjPos(thiz.config.container.find(".outerContainer")[0]);
					if(move){
						if(direction == "left"){
							dragLeft = oEvent.clientX - outerContainerPosition.x;
							if(dragLeft >= thiz.config.container.width() - thiz.config.dragBarWidth){
								dragLeft = thiz.config.container.width() - thiz.config.dragBarWidth;
							}
							_this.css({left:dragLeft+"px"});
							thiz.config.outerLeft.width(dragLeft); 
							if(thiz.rightIndex != 0){ //右边没隐藏
								thiz.config.outerCenter.css({
									"width":thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true) + "px",
									"left":thiz.config.outerLeft.outerWidth(true) +"px"
									});
							}else{
								thiz.config.outerCenter.css({
									"width":thiz.config.container.width()  - thiz.config.outerLeft.outerWidth(true) -  thiz.config.outerRight.outerWidth(true) + "px",
									"left":thiz.config.outerLeft.outerWidth(true) +"px"
								});
							}
							
						}else{
							dragLeft = thiz.config.container.width() - oEvent.clientX + outerContainerPosition.x;
							if(dragLeft >= thiz.config.container.width() - thiz.config.dragBarWidth){
								dragLeft = thiz.config.container.width() - thiz.config.dragBarWidth;
							}
							_this.css({right:dragLeft +"px"});
							thiz.config.outerRight.width(dragLeft); 
							if(thiz.leftIndex != 0){ //zuo边没隐藏
								thiz.config.outerCenter.css({
									"width":thiz.config.container.width()  - thiz.config.outerRight.outerWidth(true) + "px"
								});
							}else{
								thiz.config.outerCenter.css({
									"width":thiz.config.container.width()  - thiz.config.outerLeft.outerWidth(true) -  thiz.config.outerRight.outerWidth(true) + "px"
								});
							}
						}
					}
				}).on("mouseup",function(){
					move = false;
				});
			},
			cpos:function(x, y)  {  
				this.x = x;  
				this.y = y;  	
			} ,
			getObjPos:function(ATarget) { 
				var thiz =this;
				var target = ATarget;  
				var pos = new thiz.cpos(target.offsetLeft, target.offsetTop);  
				var target = target.offsetParent;  
				while (target)  
				{  
					pos.x += target.offsetLeft;  
					pos.y += target.offsetTop;  
					target = target.offsetParent  
				}  
				return pos;  
			},
			resize:function(){
				var thiz = this;
				if(thiz.leftIndex == 0 && thiz.rightIndex != 0){ //右侧隐藏时,zuo 不隐藏
					thiz.config.outerCenter.width(thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true));
				}else if(thiz.leftIndex != 0 && thiz.rightIndex == 0){
					thiz.config.outerCenter.width(thiz.config.container.width() - thiz.config.outerRight.outerWidth(true));
				}else if(thiz.leftIndex == 0 && thiz.rightIndex == 0){ //都不隐藏
					thiz.config.outerCenter.width(thiz.config.container.width() - thiz.config.outerLeft.outerWidth(true) - thiz.config.outerRight.outerWidth(true));
				}else if(thiz.leftIndex != 0 && thiz.rightIndex != 0){
					thiz.config.outerCenter.width(thiz.config.container.width());
				}			
			}
	};
	$.extend({
		dragLayout: function(config) {
			return $.extend({}, layout).init(config);
		}
	});
})(jQuery);


